﻿@model prueba_mapas_mvc_goggle.Models.ClaseInfoReporte
@{
    ViewBag.Title = "reporte";
}

<h2>Buscar</h2>

<script type="text/javascript" src="../../Scripts/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery-ui-1.8.11.min.js"></script>
<link  href="../../Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
    $(document).ready(function () {
        $("#fecha1").datepicker();
    });
</script>



@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Parametros de búsqueda</legend>

        <div class="editor-label">Fecha inicio</div>
        <input type="text" id="fecha1" name="fechaInicio" />
        @*<div class="editor-field">@Html.TextBox("fechaInicio","", new { id = "news_date" })</div>*@

        <div class="editor-label">Fecha fin</div>
        <div class="editor-field">@Html.TextBox("fechaFin")</div>

        <div class="editor-label">Equipo:</div>
        <div class="editor-field">@Html.TextBox("equipo_id")</div>
    
        <div class="editor-label">Proceso:</div>
        <div class="editor-field">@Html.TextBox("proceso")</div>

        <div class="editor-label">Verificacion:</div>
        <div class="editor-field">@Html.TextBox("verificacion")</div>

        <div class="editor-label">Observacion:</div>
        <div class="editor-field">@Html.TextBox("observacion")</div>

        <div class="editor-label">Conclusion:</div>
        <div class="editor-field">@Html.TextBox("conclusion")</div>

        <div class="editor-label">Recomendacion:</div>
        <div class="editor-field">@Html.TextBox("recomendacion")</div>

          <p><input type="submit" value="Buscar" /></p>
    </fieldset>
}



<script type="text/javascript">
  $(document).ready(function () {
    var goog;
    goog = @Html.Raw(ViewBag.datos);

    var plot1 = $.jqplot('chart1', [goog], {
        grid: {
          
            drawBorder: false,
            shadow: false,
            background: 'rgba(0,0,0,0)'
        },
        title: 'Grafico de Dosis',
        highlighter: { show: true },
        seriesDefaults: { 
            shadowAlpha: 0.1,
            shadowDepth: 2,
            fillToZero: true
        },
        series: [
            {
                color: 'rgba(50,50,50,2)',
                negativeColor: 'rgba(50,50,50,2)',
                showMarker: true,
                showLine: true,
                fill: true,
                fillAndStroke: false,
                markerOptions: {
                    style: 'filledCircle',
                    size: 8
                },
                rendererOptions: {
                    smooth: true
                }
            },
            {
                color: 'rgba(01, 01, 01, 0.7)',
                showMarker: true,
                rendererOptions: {
                    smooth: true,
                },
                markerOptions: {
                    style: 'filledSquare',
                    size: 8
                },
            }
        ],
        axes: {
                xaxis: {
                label:'Periodo',
                    renderer: $.jqplot.DateAxisRenderer,
                    tickOptions: { formatString: "%Y/%#m/%#d "}
                },
                yaxis: {
                min:0,
                label:'@ViewBag.nombre_unidad',
                    // renderer: $.jqplot.LogAxisRenderer,
                    tickOptions: { prefix: '' }
                    
                }
            }
           
    });

 
});
</script>

<script type="text/javascript">
    $(document).ready(function () {

        if (!$.jqplot.use_excanvas) {
            $("#chart1").each(function () {
                var btn = $('#prueba');
                btn.bind('click', { chart: $(this) }, function (evt) {
                    //alert(evt.data.chart.jqplotToImageStr());
                    $("#imagen_grafico1").attr('value', evt.data.chart.jqplotToImageStr());
                });
                $(this).after(btn);
                btn = null;
            });
        }
        $('#chart1').CanvasHack();
    });

</script>



<script type="text/javascript" src="../../Scripts/jquery-1.5.1.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/jquery.jqplot.min.js"></script>
<link rel="stylesheet" type="text/css" href="../../Scripts/plugins/jquery.jqplot.min.css" />
<link rel="stylesheet" type="text/css" href="../../Scripts/examples.min.css" />
<script type="text/javascript" src="../../Scripts/plugins/jqplot.dateAxisRenderer.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/jqplot.cursor.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/jqplot.highlighter.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/jqplot.highlighter.min.js"></script>


<script type="text/javascript">
    $(document).ready(function () {
    var goog;
        // Enable plugins like cursor and highlighter by default.
        $.jqplot.config.enablePlugins = true;
        // For these examples, don't show the to image button.
        $.jqplot._noToImageButton = false;
        //goog = [["6/22/2012 00:00:00", 425.32]];
        
        goog = @Html.Raw(ViewBag.datos);
        opts = {
            title: 'Grafico de Mediciones',
            
            series: [{    
                neighborThreshold: 0
            }],
            axes: {
                xaxis: {
                label:'Periodo',
                    renderer: $.jqplot.DateAxisRenderer,
                    tickOptions: { formatString: "%Y/%#m/%#d "} //%#H:%#M:%#S
                },
                yaxis: {
                min:0,
                label:'@ViewBag.nombre_unidad',
                    // renderer: $.jqplot.LogAxisRenderer,
                    tickOptions: { prefix: '' }
                }
            },
            cursor: { zoom: true }
        };

        plot2 = $.jqplot('chart2', [goog], opts);
       
    });

</script>


<script type="text/javascript">
    $(document).ready(function () {

        if (!$.jqplot.use_excanvas) {
            //$('div.jqplot-target').each(function () {
            $("#chart2").each(function () {
                // Add a view image button
                //var btn = $(document.createElement('button'));
                ///var btn = $('#EnviarDatos');
                var btn = $('#prueba');
                //btn.text('Capturar Imagen2');
                btn.bind('click', { chart: $(this) }, function (evt) {
                    //alert(evt.data.chart.jqplotToImageStr());
                    $("#imagen_grafico").attr('value', evt.data.chart.jqplotToImageStr());


                }); //

                ////////////////////////////////////////////////
                $(this).after(btn);

                // add a save image button
                // btn = $(document.createElement('button'));
                //btn.text('Save as PNG');
                //btn.bind('click', { chart: $(this) }, function (evt) {
                //   evt.data.chart.jqplotSaveImage();
                // });
                // $(this).after(btn);
                btn = null;
            });
        }

        $('#chart2').CanvasHack();
    });


</script>


<h2>Grafico de Mediciones Punto: @ViewBag.leyenda1</h2>

<div style=" padding-left:30px; height:250px; width:450px; float:right">

<div id="chart1" style=" height:200px; width:400px"></div>
</div>

<div style=" padding-left:30px; height:250px; width:450px;float:right">
<div id="chart2" style=" height:200px; width:400px;"></div>
</div>


<div id="prueba1" style="height:350px; width:300px;">
<fieldset>
    <legend>Datos Estadisticos</legend>

    <div class="display-label">Dosis del periodo</div>
    <div class="display-field">
         @ViewBag.dosis @ViewBag.unidad_dosis
    </div>

    <div class="display-label">Numero de datos considerados</div>
    <div class="display-field">
        @ViewBag.numero_muestras
    </div>

    <div class="display-label">Promedio</div>
    <div class="display-field">
        @ViewBag.promedio
    </div>
    <div class="display-label">Varianza</div>
    <div class="display-field">
        @ViewBag.varianza 
    </div>
    <div class="display-label">Desviacion Estandard</div>
    <div class="display-field">
        @ViewBag.desviacion 
    </div>
    </fieldset>
</div>

<input id="prueba" type="button" value="adjuntar graficos" />

<script type="text/javascript">
    $(document).ready(function () {
    var btn = $('#prueba11');
        btn.bind('click', function() {
                  $("#promedio").attr('value', @ViewBag.promedio);
                    $("#instalacion").attr('value', @ViewBag.instalacion);
                     $("#detector").attr('value', @ViewBag.detector);
                     $("#dosis").attr('value', @ViewBag.dosis);
                     $("#num_muestra").attr('value', @ViewBag.numero_muestras);
                     $("#varianza").attr('value', @ViewBag.varianza);
                     $("#desviacion").attr('value', @ViewBag.desviacion);
                     $("#maximo").attr('value', @ViewBag.maximo);
                     $("#minimo").attr('value', @ViewBag.minimo);
                     $("#operacion").attr('value', @ViewBag.operacion);
                     $("#investigacion").attr('value', @ViewBag.investigacion);
                     $("#intervencion").attr('value', @ViewBag.intervencion);
                     $("#distancia").attr('value', @ViewBag.distancia);
                     $("#diasNoOP").attr('value', @ViewBag.diasNoOP);
                     $("#diasFalla").attr('value', @ViewBag.diasFalla);
                     $("#varianza").attr('value', @ViewBag.varianza);
                     $("#desviacion").attr('value', @ViewBag.desviacion);
                     $("#maximo").attr('value', @ViewBag.maximo);
                     $("#minimo").attr('value', @ViewBag.minimo);
                     $("#operacion").attr('value', @ViewBag.operacion);
                     $("#investigacion").attr('value', @ViewBag.investigacion);
                     $("#intervencion").attr('value', @ViewBag.intervencion);
                     $("#distancia").attr('value', @ViewBag.distancia);
                     $("#diasNoOP").attr('value', @ViewBag.diasNoOP);                
          });
      
    });

</script>

@*<input id="prueba11" type="button" value="adjuntar" />*@

@using (Html.BeginForm("Buscar1", "Reporte"))
{
<div style="visibility:hidden" >
@Html.TextBox("imagen_grafico") 
@Html.TextBox("imagen_grafico1")
@Html.EditorFor(model => model.fechaInicio)
@Html.EditorFor(model => model.fechaFin)
@Html.EditorFor(model => model.equipo_id)
@Html.EditorFor(model => model.periodo)
@Html.EditorFor(model => model.proceso)
@Html.EditorFor(model => model.calibracion)
@Html.EditorFor(model => model.mantencion)
@Html.EditorFor(model => model.verificacion)
@Html.EditorFor(model => model.estado)
@Html.EditorFor(model => model.conclusion)
@Html.EditorFor(model => model.observacion) 
@Html.EditorFor(model => model.recomendacion) 
@Html.EditorFor(model => model.instalacion)
@Html.EditorFor(model => model.detector)
@Html.EditorFor(model => model.dosis)
@Html.EditorFor(model => model.num_muestra)
@Html.EditorFor(model => model.promedio)
@Html.EditorFor(model => model.varianza)
@Html.EditorFor(model => model.desviacion)
@Html.EditorFor(model => model.maximo) 
@Html.EditorFor(model => model.minimo)
@Html.EditorFor(model => model.operacion) 
@Html.EditorFor(model => model.investigacion) 
@Html.EditorFor(model => model.intervencion)
@Html.EditorFor(model => model.distancia)
@Html.EditorFor(model => model.diasNoOP)

</div>   
   
    <p><input type="submit" value="Enviar Datos" /></p>
}
 
    


